@charset "utf-8";
body {
    display: flex;
    flex-direction: column;
}
.mb90 {margin-bottom: min(12vw, 90px);}
.mb60 {margin-bottom: min(8vw, 60px);}
.mb30 {margin-bottom: min(4vw, 30px);}
.mb20 {margin-bottom: min(3vw, 20px);}
.mb10 {margin-bottom: min(2vw, 10px);}
.red {color: #e7211a;}

/*header*/
/*********************/
#header {
    width: 100%;
    height: min(18.6666vw, 140px);
    border-bottom: solid 1px rgba(140, 140, 140, 0.8);
    border-top: min(1.3333vw, 10px) solid #614c3f;
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
}
#header .wrap_hd {
    position: relative;
    width: 100%;
    height: 100%;
}
#header .h1_name {
    padding: min(2.2666vw, 17px) 0 0 min(4vw, 30px);
    margin: 0;
}
#header .h1_name .top_logo {
    width: min(13.3333vw, 100px);
    height: min(13.3333vw, 100px);
}
/*menu button*/
/*********************/
#header #menubtn {
    width: min(9.33333vw, 70px);
    height: min(6.4vw, 48px);
    position: absolute;
    border: none;
    background-color: #fff;
    cursor: pointer;
    right: min(4vw, 30px);
    top: min(5.2666vw, 44px);
}
#header #menubtn .button_wp {
    position: relative;
    width: 100%;
    height: 100%;
}
#header #menubtn .bnr {
    background-color: #614c3f;
    height: min(.8vw, 6px);
    width: 100%;
    border-radius: 10px;
    display: block;
    position: absolute;
    left: 0;
}
#header #menubtn .bnr:nth-of-type(1) {animation:menu_close_01 .3s ease-in-out forwards;}
#header #menubtn .bnr:nth-of-type(3) {animation:menu_close_03 .3s ease-in-out forwards;}
#header #menubtn .bnr:nth-of-type(2) {animation:menu_close_02 .2s ease-in-out forwards;}
#header #menubtn.active .bnr:nth-of-type(1) {animation:menu_open_01 .3s ease-in-out forwards;}
#header #menubtn.active .bnr:nth-of-type(3) {animation:menu_open_03 .3s ease-in-out forwards;}
#header #menubtn.active .bnr:nth-of-type(2) {animation:menu_open_02 .2s ease-in-out forwards;}

/*animation*/
@keyframes menu_open_01 {
    0%    {top: 0;transform: rotate(0);}
    100%{top: min(2.8vw, 21px);transform: rotate(135deg);}
}
@keyframes menu_close_01 {
    0%    {top: min(2.8vw, 21px);transform: rotate(135deg);}
    100%{top: 0;transform: rotate(0);}
}
@keyframes menu_open_02 {
    0%    {top: min(2.8vw, 21px);transform: scale(1,1);}
    100%{top: min(2.8vw, 21px);transform: scale(0,1);transform-origin: center;opacity: 0;}
}
@keyframes menu_close_02 {
    0%    {top: min(2.8vw, 21px);transform: scale(0,1);transform-origin: center;opacity: 0;}
    100%{top: min(2.8vw, 21px);transform: scale(1,1);opacity: 1;}
}
@keyframes menu_open_03{
    0%    {bottom: 0;transform: rotate(0);}
    100%{top: min(2.8vw, 21px);transform: rotate(225deg);}
}
@keyframes menu_close_03 {
    0%    {top: min(2.8vw, 21px);transform: rotate(225deg);}
    100%{bottom: 0;transform: rotate(0);}
}

/*glmenu*/
/*********************/
#header .wrap {
    width: 100%;
    height: calc(100% - min(18.6666vw, 140px));
    position: fixed;
    top: min(18.6666vw, 140px);
    left: 0;
    display: none;
}
#gnavi {
    width: 100%;
    height: 100%;
    padding: min(9.3333vw, 70px) min(6.6666vw, 50px) 0;
    background-color: #614c40;
    transform-origin: top;
    animation:gnvOff .8s forwards;
    overflow-y: hidden;
}
.on #gnavi {
    animation:gnvOpen .8s forwards;
}
#gnavi .gnav_ul {
    opacity: 0;
    animation:fadeout_up .8s forwards;
}
.on #gnavi .gnav_ul {
    animation:fadein_down .8s .7s forwards;
}
#gnavi .gnav_li {
    border-bottom: 1px solid #91827a;
}
#gnavi .gnav_li.libtn {
    border-bottom: none;
    padding: min(2.5vw, 20px) 0;
}
#gnavi .gnav_link {
    color: #fff;
    /*font-size: clamp(1.6rem, 4.168vw, 3.2rem);*/
    font-size: min(2.345vw, 1.8rem);
    text-decoration: none;
    padding: min(2.5vw, 20px) 0;
    display: block;
}
#gnavi .gnav_link.gnav_btn {
    border: 2px solid #b5aba5;
    display: inline-block;
    padding: min(1.25vw, 10px) min(3.75vw, 30px);
}

#gnavi .gnav_link {
    color: #fff;
    font-size: clamp(1.6rem, 4.168vw, 3.2rem);
    text-decoration: none;
    padding: min(5vw, 40px) 0;
    display: block;
}
.gotop,
.gotop .img_top {
    width: min(9vw, 70px);
    height: min(9vw, 70px);
    border-radius: 50%;
    cursor: pointer;
}
.gotop .img_top {display: block;}
.gotop {
    position: fixed;
    right: min(6.6666vw, 50px);
    bottom: min(9vw, 70px);
    z-index: 4;
    opacity: 0;
    visibility: hidden;
    transition: all .6s;
}
.gotop.fade_in {
    opacity: 1;
    visibility: visible;
}

@keyframes gnvOpen {
    0% {
        opacity: 0;
        transform: scale(1,0);
    }
    100% {
        opacity: 1;
        transform: scale(1,1);
    }
}
@keyframes gnvOff {
    0% {
        opacity: 1;
        transform: scale(1,1);
    }
    100% {
        opacity: 0;
        transform: scale(1,0);
    }
}
@keyframes fadein_down {
    0%    {
        opacity: 0;
        transform: translateY(-5vw);
    }
    100%{
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes fadeout_up {
    0%    {
        opacity: 1;
        transform: translateY(0);
    }
    100%{
        opacity: 0;
        transform: translateY(-5vw);
    }
}
/*footer*/
/*********************/
#footer {
    background-color: #f7f5f0;
}
#footer #ftnav {
    padding: min(6.6666vw, 50px);
}
#footer .copy {
    color: #fff;
    font-size: clamp(10px, 2.606vw, 2rem);
    text-align: center;
    background-color: #614c40;
    padding: .5em 0 .3em;
}
#footer .fnav_li {
    position: relative;
    padding-left: 1.5rem;
}
#footer .fnav_li::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1.5vw 0 1.5vw 1.95vw;
    border-color: transparent transparent transparent #c30d22;
    position: absolute;
    left: 0;
    top: calc(50% - 1.5vw);
}
#footer .fnav_li + .fnav_li {margin-top: min(4vw, 30px);}
#footer .fnav_link {
    color: #000;
    font-size: clamp(1.2rem, 3.126vw, 2.4rem);
    text-decoration: none;
    display: inline-block;
}
/*gotop*/

@media screen and (min-width:641px) {
    #footer .fnav_li::before {
        border-width: 8px 0 8px 10px;
        top: calc(50% - 8px);
    }
}

/*main*/
/*********************/
#main {
    flex: 1;
    padding: min(25vw, 190px) min(6.6666vw, 50px) min(6.6666vw, 50px);
}
#main .free_area {
    font-size: clamp(1.3rem, 3.386vw, 2.6rem);
}
#main .section {
    width: min(100%, 650px);
    margin: 0 auto min(6.6666vw, 50px);
}
#main .section.mb60 {margin-bottom: min(8vw, 60px);}
#main .section.mb90 {margin-bottom: min(12vw, 90px);}

.h2_ttl {
    color: #c30d23;
    font-size: clamp(2rem, 5.21vw, 4rem);
    font-weight: bold;
    padding-bottom: min(3.3333vw, 25px);
    margin-bottom: min(4vw, 30px);
    border-bottom: 1px solid #000;
}
.h2_finish {
    color: #000;
    font-size: clamp(2.6rem, 6.77vw, 5.2rem) ;
    text-align: center;
}

.h3_ttl {
    color: #000;
    font-size: clamp(1.5rem, 3.908vw, 3rem);
}
.__finish .h3_ttl {text-align: center;}
.txt {font-size: clamp(1.2rem, 3.126vw, 2.4rem);}
.__center {text-align: center;}
.txt.__large {font-size: clamp(1.5rem, 3.908vw, 3rem);}
.txt.__mdl {font-size: clamp(1.3rem, 3.386vw, 2.6rem);}
.kome {
    padding-left: 1em;
    text-indent: -1em;
}

.flex {
    display: flex;
}
.flex.__fxcenter {
    justify-content: center;
    align-items: center;
}

.period {
    font-size: clamp(1.3rem, 2.865vw, 2.6rem);
    text-align: center;
    margin:    min(2vw, 20px) 0 min(5.666vw, 40px);
}
.period span {
    display: inline-block;
    transform: rotate(90deg);
}

/* top */
/*#main .event_top {margin-bottom: min(4vw, 30px);}*/
#main .project_name {
    color: #000;
    font-size: clamp(1.5rem, 3.908vw, 3rem);
    font-weight: bold;
    text-align: center;
    line-height: 2;
}
#main .event_name {
    color: #c30d23;
    font-size: clamp(2.5rem, 6.51vw, 5.0rem);
    font-weight: bold;
    text-align: center;
    line-height: 2;
    margin-bottom: 1.2rem;
}

/*lot*/
#main .__sec_lot {
    margin: 0 auto min(5.3333vw, 40px);
}
#main .__sec_lot .sec {
    height: min(60vw, 450px);
    position: relative;
}
#main .__sec_lot .img {

    width: auto;
    max-width: 100%;
    height: auto;
/*
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
*/
}
.__sec_lot .wrap {
    width: 100%;
}
.wrap.__start {
    background-color: #f1eed0;
    border-radius: min(6.6666vw, 50px);
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 4;
}
.wrap.__start .img_start,
.wrap.__start #click_btn {
    border: none;
    background: none;
    width: min(40vw,300px);
    height: min(40vw,300px);
    border-radius: 50%;
    cursor: pointer;
}
.wrap.__start .img_start {
    box-shadow: 10px 8px 10px 0px rgba(0,0,0,0.25);
}
.wrap.__start .img_click {
    width: min(42.1333vw, 316px);
    height: auto;
    margin: -0.6em 0 0 3em;
}

.wrap.__lot {
    position: relative;
    z-index: 3;
}
.wrap.__winner .img_frame,
.wrap.__lot .img_frame {
    position: relative;
    z-index: 2;
}
.wrap.__winner .img_prize,
.wrap.__lot .img_lot {
    position: absolute;
    /*top: min(4vw, 30px);*/
    top: min(3.3333vw, 25px);
    /* left: min(4vw, 30px); */
    left: 50%;
    transform: translateX(-50%);
}

.wrap.__winner .img_prize,
.wrap.__lot .img_lot {
    width: min(78.67vw, 590px);
}
.section.__exchange .wrap.__winner .img_prize,
.section.__exchange .wrap.__lot .img_lot {
    width: min(70.67vw, 515px);
    top: min(4vw, 30px);
}

.wrap.__lot {
    position: relative;
}

.wrap.__winner {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}
.wrap.__winner .block {position: relative;}

.wrap.__badluck {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.wrap.__badluck .img {
    display: block;
    border-radius: min(7.3333vw, 55px);
}
.result {display: none;}

@media screen and (max-width:800px) {
    .wrap.__winner .img_prize,
    .wrap.__lot .img_lot {
        max-width: 100%;
    }
}

/*winner*/
#winner_txt .prize_name {
    color: #000;
    font-size: clamp(1.8rem, 4.688vw, 3.6rem);
    font-weight: bold;
    text-align: center;
    margin: min(4vw, 30px) 0 min(2vw, 20px);
}
#winner_txt .kome {
    font-size: clamp(1.2rem, 3.126vw, 2.4rem);
    text-align: center;
    margin-bottom: min(4vw, 30px);
}
#winner_txt .win_nom {
    color: #c30d23;
    font-size: clamp(1.8rem, 4.688vw, 3.6rem);
    text-align: center;
    margin-bottom: min(4vw, 30px);
}
#winner_txt .win_nom .wp {
    display: inline-block;
    border: min(.5333vw, 4px) solid #000;
    width: min(70vw, 530px);
    padding: 3px 0 2px;
}

#badluck_txt {margin-top: min(6.6666vw, 50px);}


/* exchange / finish */
/*********************/
.__form,
.__finish,
.__exchange {
    background-color: #f1eed0;
    border-radius: min(2.6666vw, 20px);
    padding: min(6.6666vw, 50px) min(4vw, 30px);
}
.__exchange .h2_ttl {
    text-align: center;
    padding-bottom: 0;
    border-bottom: none;
    margin-bottom: min(3.3333vw, 25px);
}
.__finish .h2_ttl {
    text-align: center;
    border-bottom: none;
    margin-bottom: 0;
    padding: 0;
}
.__exchange .txt {margin-bottom: min(6.2666vw, 45px);}

/*map*/
.fig_map {margin-top: min(4vw, 30px);}
.fig_map .img {
    width: 100%;
    height: auto;
    display: block;
    border: 1px solid #000;
    border-radius: min(2.6666vw, 20px);
}
/*sample*/
.fig_sample {
    text-align: center;
    width: min(66.4vw, 498px);
    margin: 0 auto min(6.6666vw, 50px);
}
.fig_sample .img {
    width: 100%;
    height: auto;
    display: inline-block;
}

/*button*/
/*********************/
/*01*/
.btn01 {
    color: #fff;
    font-size: clamp(1.8rem, 4.688vw, 3.6rem);
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding: .6em 1em .5em 3.2em;
    background-color: #c30d23;
    border-radius: min(2.6666vw, 20px);
    position: relative;
}
.__exchange .btn01 {
    font-size: clamp(1.5rem, 3.908vw, 3rem);
    padding: .8em 2em .6em 3.2em;
}
.btn01::after,
.btn01::before {
    content: '';
    display: block;
    position: absolute;
}
.btn01::after {
    width: 1px;
    height: calc(100% - min(4vw, 30px));
    background-color: #fff;
    top: min(2vw, 15px);
    left: 2.2em;
}
.btn01::before {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1.5vw 0 1.5vw 1.95vw;
    border-color: transparent transparent transparent #fff;
    left: 1em;
    top: calc(50% - 1.5vw);
}
.btn + .btn {margin-top: min(2.6666vw, 20px);}

/*close / back*/
.btn_back,
.btn_close {
    color: #000;
    font-size: clamp(1.8rem, 4.688vw, 3.6rem);
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    border: 1px solid #000;
    border-radius: min(2.6666vw, 20px);
}
.btn_back {
    padding: .32em 2.2em .25em;
}
.btn_close {
    width: min(44vw, 330px);
    padding: .32em 0 .25em;
    padding-left: calc(clamp(1.8rem, 4.688vw, 3.6rem) * 1.6);
    position: relative;
}
.btn_close::before,
.btn_close::after {
    content: '';
    display: block;
    width: calc(clamp(1.8rem, 4.688vw, 3.6rem) * 0.78);
    height: 4.4px;
    background-color: #000;
    position: absolute;
    left: 2.6em;
    top: calc(50% - 2.5px);
}
.btn_close::before {transform: rotate(45deg)}
.btn_close::after    {transform: rotate(-45deg)}


/*02*/
.btn03,
.btn02 {
    color: #fff;
    font-size: clamp(1.8rem, 4.688vw, 3.6rem);
    font-weight: bold;
    text-decoration: none;
    border-radius: min(2.6666vw, 20px);
    border: none;
    padding: .36em 1em .28em;
    background-color: #c30d23;
    cursor: pointer;
    transition: all .3s ease-out;
}
.btn02 {padding: .36em 4em .28em;}
.btn02[disabled] {
    background-color: #9f9fa0;
    cursor: default;
}

@media screen and (min-width:768px) {
    .btn01::before {
        border-width: 10.5px 0 10.5px 15px;
        top: calc(50% - 10.5px);
    }
}
@media screen and (max-width:420px) {
    .btn_close::before,
    .btn_close::after {
        height: 3px;
        left: 2.2em;
        top: calc(50% - 1.5px);
    }
}

/*form*/
.input_mail {
    color: #000;
    font-size: clamp(1.3rem, 3.386vw, 2.6rem);
    padding: .6em .8em;
    margin-top: min(6.6666vw, 50px);
    width: 100%;
}
.input_mail placeholder {
    color: #7f7f7f;
}
input#agree {
    width: min(4vw, 28px);
    height: min(4vw, 28px);
    border: 1px solid #000;
    margin-right: .5em;
}
.txt_agreement {
    margin: min(10vw, 75px) 0 min(6vw, 45px);
}

@media screen and (min-width:768px) {
    input#agree {
        width: min(3vw, 28px);
        height: min(3vw, 28px);
    }
}

/*form*/
/**************/
.form_flow {
    display: flex;
    justify-content: space-between;
    margin-bottom: min(4vw, 30px);
}
.form_flow .flow_li {
    color: #000;
    font-size: clamp(1.7rem, 4.428vw, 3.4rem);
    font-weight: bold;
    text-align: center;
    width: min(24.4vw, 183px);
    padding: .4em 0 .3em;
    background-color: #f1eed0;
    border-radius: min(1.5vw, 10px);
    position: relative;
}
.form_flow .flow_li.now {
    color: #fff;
    background-color: #c30d23;
}
.form_flow .flow_li.comp {
    color: #fff;
    background-color: #9f9fa0;
}
.form_flow .flow_li::after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-top: min(1.6vw, 12px) solid transparent;
    border-bottom: min(1.6vw, 12px) solid transparent;
    border-left: min(2.1333vw, 16px) solid #000000;
    border-right: 0;
    position: absolute;
    top: calc(50% - min(1.6vw, 12px));
    left: calc(100% + min(2.1333vw, 16px));
}
.form_flow .flow_li:last-child::after {display: none;}

.list_caution {
    list-style: disc;
    margin: 1em 0 0 1.8em;
}
.list_caution .listcs_li {
    font-size: clamp(1.2rem, 3.126vw, 2.4rem);
    line-height: 1.6;
}
.form_dl dt {
    color: #c30d23;
    font-size: clamp(1.8rem, 4.688vw, 3.6rem);
    font-weight: bold;
    display: flex;
    align-items: center;
    margin-bottom: min(2vw, 15px);
}
.form_dl dt em {
    font-size: clamp(1.1rem, 2.606vw, 2rem);
    font-style: normal;
    border: 1px solid #c30d23;
    padding: 0 .4em 0 .3em;
    margin: 0 0 3px .5em;
}
.form_dl dd {
    padding-bottom: min(4vw, 30px);
    margin-bottom: min(4vw, 30px);
    border-bottom: 1px solid #b5b5b5;
}

.form_dl dd .__input {margin-top: min(2vw, 15px);}
.form_dl dd em {
    font-weight: bold;
    font-style: normal;
}
.form_dl dd .flex_tel {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.form_dl dd .flex_tel span {
    /*font-size: clamp(1.2rem, 3.126vw, 2.4rem);*/
    width: min(3.2vw, 24px);
    height: 2px;
    margin: 0 min(1.6vw, 12px);
    position: relative;
}
.form_dl dd .flex_tel span::before {
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-color: #000;
    position: absolute;
    left: 0;
    top: 0;
}
select,
input[type=text] {
    font-size: clamp(1.2rem, 3.126vw, 2.4rem);
    padding: .5em;
    background-color: #fff;
    border: 1px solid #6e696b;
}
input[type=text].form_txt {width: 100%;}
input[type=text].form_tel {
    text-align: center;
    width: calc((100% - min(12.8vw, 96px)) / 3);
}
textarea {
    font-size: clamp(1.2rem, 3.126vw, 2.4rem);
    padding: .5em;
    background-color: #fff;
    border: 1px solid #6e696b;
}
textarea.form_txt {width: 100%;}

input[type=radio],
input[type=checkbox] {
    display: none;
}
label {
    cursor: pointer;
    display: inline-block;
    position: relative;
    width: auto;
}
label::before,
label::after {
    content: '';
    display: block;
    position: absolute;
    transition: all .2s;
}
label::before {background-color: #fff;}

input[type=checkbox] + label[for=agree] {
    padding-left: min(5.333vw, 40px);
}
input[type=checkbox] + label[for=agree]::before {
    width: min(4vw, 30px);
    height: min(4vw, 30px);
    border: 1px solid #6e696b;
    top: calc(50% - min(2vw, 15px));
    left: 0;
}
input[type=checkbox] + label[for=agree]::after {
    width: min(2.5vw, 20px);
    height: min(4vw, 30px);
    border-right: min(1.2vw,5px) solid #c30d23;
    border-bottom: min(1.2vw,5px) solid #c30d23;
    transform: rotate(45deg);
    opacity: 0;
    top: calc(50% - min(3vw, 20px));
    left: 5px;
}
input[type=checkbox]:checked + label[for=agree]::after {
        opacity: 1;
}

input[type=radio] + label {
    padding-left: min(6.666vw, 50px);
}
input[type=radio] + label::before {
    border: 1px solid #6e696b;
    border-radius: 50%;
    width: min(4.8vw, 36px);
    height: min(4.8vw, 36px);
    left: 0;
    top: calc(50% - min(2.4vw, 18px));
}
input[type=radio] + label::after {
    width: min(3.2vw, 24px);
    height: min(3.2vw, 24px);
    background-color: #c30d23;
    border-radius: 50%;
    left: calc((min(3.2vw, 24px) - min(1.6vw, 12px)) / 2 );
    top: calc(50% - min(1.6vw, 12px));
    opacity: 0;
}
input[type=radio]:checked + label::after {
        opacity: 1;
}


/*sample*/
.sample_txt {
    color: #c30d23;
    font-size: clamp(6rem, 15vw,12rem);
    font-weight: bold;
    text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;
    transform: rotate(-25deg);
    position: absolute;
    z-index: 4;
    left: calc(50% - 2em);
}
.sample_txt.__01 {top: 25%;}
.sample_txt.__02 {top: 45%;}
.sample_txt.__03 {top: 65%;}